.skeleton {
  height: 15px;
  margin-top: 15px;
  position: relative;
  animation: loading 2s ease infinite;
  -webkit-animation: loading 2s ease infinite;

  background-image: linear-gradient(
    90deg,
    #F3F4F6 25%,
    #E8E8E8 37%,
    #F3F4F6 63%
  );
  background-image: -webkit-gradient(
    linear,
    left top,
    right top,
    color-stop(25%, #F3F4F6),
    color-stop(37%, #E8E8E8),
    color-stop(63%, #F3F4F6)
  );
  background-size: 400% 100%;

  &.skeletonAvatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
  }
}

@keyframes loading {
  0% {
    background-position: 100% 50%;
  }

  to {
    background-position: 0 50%;
  }
}

@-webkit-keyframes loading {
  0% {
    background-position: 100% 50%;
  }

  to {
    background-position: 0 50%;
  }
}